<template>
  <div class="table">
    <el-row>
      <el-button type="warning" @click="refresh">刷新</el-button>
    </el-row>
    <!--树形展示-->
    <el-tree
      :data="data"
      :props="defaultProps"
      accordion
      @node-click="handleNodeClick"
    >
    </el-tree>
    <el-button type="text" @click="add_new_Area" class="button-style"
      ><i class="el-icon-plus" style="margin-right: 5px"></i>添加</el-button
    >
    
  </div>
</template>

<script>
export default {
  data() {
    return {
      data: [],
      deptData: { id: null, deptname: "", parentid: "" },
      defaultProps: {
        children: "children",
        label: "deptName",
      },
    };
  },
  methods: {
    handleNodeClick(treedata) {
      console.log(treedata);
    },

    refresh() {
      this.$http.get("/dept/tree").then((v) => {
        console.log(JSON.stringify(v));
        this.data = v.data;
      });
    },

    add_new_Area() {

    },
  },
  mounted: function () {
    this.refresh();
  },
};
</script>

<style lang="less" scoped>
.search {
    width: 350px;
  }
</style>